<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/css/bootstrap.min.css" 
                    integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <title>门诊排班</title>
</head>
<body>
    <!-- 导航栏区域 -->
    <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
        <a class="navbar-brand" href="#">东方医院</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
      <!-- 首页 -->
      <div class="collapse navbar-collapse" id="navbarSupportedContent">
          <ul class="navbar-nav mr-auto">   
            <li class="nav-item mx-3">
              <a class="nav-link active" aria-current="page" href="#">首页</a>
            </li>
      <!-- 医院概况 -->
            <li class="nav-item dropdown mx-3">
              <a id="my-dropdown" class="nav-link dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">医院概况</a>
              <div class="dropdown-menu" aria-labelledby="my-dropdown">
                  <a class="dropdown-item " href="#">医院介绍</a>
                  <a class="dropdown-item " href="#">组织架构</a>
                  <a class="dropdown-item " href="#">医院历史</a>
              </div>
            </li>
      <!-- 医疗服务 -->
            <li class="nav-item dropdown mx-3">
              <a id="my-dropdown" class="nav-link dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">医疗服务</a>
              <div class="dropdown-menu" aria-labelledby="my-dropdown">
                  <a class="dropdown-item " href="#">医院介绍</a>
                  <a class="dropdown-item " href="#">组织架构</a>
                  <a class="dropdown-item " href="#">医院历史</a>
              </div>
            </li>
      <!-- 科室导航 -->
            <li class="nav-item mx-3">
              <a class="nav-link" href="#">科室导航</a>
            </li>
      <!-- 学术交流 -->
            <li class="nav-item mx-3">
              <a class="nav-link" href="#">学术交流</a>
            </li>
          </ul>
      <!-- 搜索框 -->
          <form class="form-inline mx-3" method="get" action="">
              <input class="form-control mr-sm-2" type="search" placeholder="搜索科室，医生" aria-label="Search">
              <button class="btn btn-success my-2 my-sm-0" type="submit">搜索</button>
          </form>
        </div>
    </nav>

    <!-- 巨型屏幕区域 -->
    <div class="jumbotron jumbotron-fluid pb-0 pt-5">
        <div class="container pl-0">
            <h1 class="display-4">门诊排班</h1>
            <p class="lead">东方医院</p>
        </div>
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="./page1.html">科室导航</a></li>
            <li class="breadcrumb-item active" aria-current="page">门诊排班</a></li>
            <li class="breadcrumb-item"><a href="./page3.html">就诊人管理</a></li>
            <li class="breadcrumb-item"><a href="./page4.html">预约挂号</a></li>
            </ol>
        </nav>
    </div>

    <!--排班日历 -->
    <div class="data">
    <h3>神经外科</h3>
    <div class="table3 mx-5">
    <table class="table table-bordered">
        <thead>
          <tr>
            <th scope="col">星期一</th>
            <th scope="col">星期二</th>
            <th scope="col">星期三</th>
            <th scope="col">星期四</th>
            <th scope="col">星期五</th>
            <th scope="col">星期六</th>
            <th scope="col">星期日</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td>6/1</td>
            <td>6/2<br/>
                <p>华佗
                    <span class="badge badge-primary">主任医师</span>
                </p>
                <p>
                    扁鹊
                    <span class="badge badge-success">副主任医师</span>
                </p>
                <p>
                    东方土锤
                    <span class="badge badge-danger">主治医师</span>
                </p>
            </td>
            <td>6/3</td>
            <td>6/4</td>
            <td>6/5</td>
            <td>6/6</td>
            <td>6/8</td>
          </tr>
          <tr>
            <td>6/9</td>
            <td>6/10</td>
            <td>6/11 <br/>
                <p>扁鹊
                    <span class="badge badge-danger">主治医师</span>
                </p>
            </td>
            <td>6/12</td>
            <td>6/13</td>
            <td>6/14</td>
            <td>6/15</td>
          </tr>
          <tr>
            <td>6/16</td>
            <td>6/17</td>
            <td>6/18 </td>
            <td>6/19</td>
            <td>6/20</td>
            <td>6/21<br/>
                <p>张仲景
                    <span class="badge badge-dark">主治医师</span>
                </p>
            </td>
            <td>6/22</td>
          </tr>
          <tr>
            <td>6/23</td>
            <td>6/24</td>
            <td>6/25</td>
            <td>6/26</td>
            <td>6/27</td>
            <td>6/28</td>
            <td>6/29</td>
          </tr>
        </tbody>
      </table>
    </div>
    </div>

    <!-- 页面页脚 -->
    <div class="jumbotron text-center mt-5 mb-0">
        <h1 class="display-4">csuft</h1>
        <p class="lead">中南林业科技大学</p>
    </div>  
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.14.7/dist/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>

<style>
    .data{
        margin-left: 60px;
    }
    .data h3{
        margin-left: 50px;
        font-size: 40px;
        font-weight: 200;
    }
    
</style>
</html>